<template>
	<view>
		<view class="btn_edit" v-if="dataList.length > 0">
			<view class="continue" v-if="showAddProject" @click="clickAddProject">添加项目</view>
			<view class="fix-text">已选技师：{{ dataList.length }} 共计：</view>
			<view class="fix-money" @click="actionClick">
				<u-icon name="rmb" color="#fe4d4f" size="15"></u-icon>
				<view style="margin:0 10rpx 0 6rpx;">{{ allAccount || 0 }}</view>
				<u-icon name="arrow-down" color="#fe4d4f" size="10"></u-icon>
			</view>
			<view class="submit" @click="clickSubmitOrder">提交订单</view>
		</view>
		<view class="action">
			<u-action-sheet :closeOnClickOverlay="true" :closeOnClickAction="true" title="已选技师" round="10"
				:show="chooseDialog" @close="chooseDialog = false">
				<scroll-view scroll-y class="action-list">
					<pro-technician-list :technicianList="dataList" :showCancelButton="true" :isChoosePerson="true"
						:goodsList="goodsList" :goodsNumConfig="goodsNumData" @deselect="cancelChoose"
						@toDetail="toMasterDetail" @minusGoods="minusGoods"
						@plusGoods="plusGoods"></pro-technician-list>
				</scroll-view>
				<view class="btn_edit" v-if="dataList.length > 0">
					<view class="continue" v-if="showAddProject" @click="clickAddProject">添加项目</view>
					<view class="fix-text">已选技师：{{ dataList.length }} 共计：</view>
					<view class="fix-money" @click="chooseDialog=!chooseDialog">
						<u-icon name="rmb" color="#fe4d4f" size="15"></u-icon>
						<view style="margin:0 10rpx 0 6rpx;">{{ allAccount || 0 }}</view>
						<u-icon name="arrow-up" color="#fe4d4f" size="10"></u-icon>
					</view>
					<view class="submit" @click="clickSubmitOrder">提交订单</view>
				</view>
			</u-action-sheet>
		</view>
	</view>
</template>

<script>
	import ProTechnicianList from '@/subPages/components/proTechnicianList'
	import api_home from "@/api/home.js"
	export default {
		name: 'BottomOrder',
		components: {
			ProTechnicianList
		},
		data() {
			return {
				allAccount: 0,
				chooseDialog: false,
				dataList: [],
				goodsNumData: {}
			}
		},
		props: {
			transferData: {
				type: Object,
				default: {}
			},
			chooseData: {
				type: Array,
				default: []
			},
			showAddProject: {
				type: Boolean,
				default: true
			},
			goodsList: {
				type: Array,
				default: []
			},
			goodsNumConfig: {
				type: Object,
				default: {}
			}
		},
		watch: {
			chooseData: {
				handler(newVal, oldVal) {
					this.dataList = uni.$u.deepClone(newVal)
					this.getAccount()
				},
				deep: true,
				immediate: true
			},
			goodsNumConfig: {
				handler(newVal, oldVal) {
					this.goodsNumData = uni.$u.deepClone(newVal)
				},
				deep: true
			}
		},
		created() {
			this.goodsNumData = uni.$u.deepClone(this.goodsNumConfig)
		},
		methods: {
			showDialog() {
				this.chooseDialog = true
			},
			getAccount() {
				this.allAccount = 0
				this.dataList.forEach(item => {
					let goodsPrice = 0
					if (item.zyOrderProductList && item.zyOrderProductList.length) {
						item.zyOrderProductList.forEach(pItem => {
							goodsPrice += this.$methods.numberMul(Number(pItem.originalPrice), Number(pItem
								.productNum))
						})
					}
					const allProAccount = this.$methods.numberAdd(this.allAccount, item.price)
					this.allAccount = this.$methods.numberAdd(allProAccount, goodsPrice)
				})
				this.allAccount = this.allAccount.toFixed(2) // 保留两位小数
			},
			actionClick() {
				if (this.dataList.length > 0) {
					this.chooseDialog = true
				}
			},
			clickAddProject() {
				const params = encodeURIComponent(JSON.stringify(this.transferData))
				uni.redirectTo({
					url: `/subPages/home/chooseProject?transferData=${params}`
				})
			},
			cancelChoose(item) {
				// 更新当前技师选中的次数
				const chooseTechnicianNumber = this.$store.getters.chooseTechnicianNumber
				this.$store.commit('TECHNICIAN_NUMBER', {
					...chooseTechnicianNumber,
					[item.id]: chooseTechnicianNumber[item.id] ? chooseTechnicianNumber[item.id] - 1 : 1
				})
				const chooseData = this.dataList.filter(cItem => {
					const cTime = cItem.subscribeStartTime.slice(0, cItem.subscribeStartTime.length - 3)
					const iTime = item.subscribeStartTime.slice(0, item.subscribeStartTime.length - 3)
					return !(cItem.id === item.id && cTime === iTime && cItem.projectId === item.projectId)
				})
				this.dataList = uni.$u.deepClone(chooseData)
				uni.setStorageSync('chooseTechnician', chooseData)
				if (!this.dataList.length) {
					uni.removeStorageSync('dataTimer')
					this.chooseDialog = false
				}
				this.getAccount()
				this.$emit('cancelItem', chooseData, item)
			},
			clickSubmitOrder() {
				if (!this.dataList || this.dataList.length === 0) return
				console.log(this.dataList, this.transferData);
				let parameter = []
				this.dataList.map((el, i) => {
					parameter.push({
						"storeId": this.transferData.storeId,
						"technicianId": el.id,
						"technicianName": el.name,
						"itemId": el.projectId,
						"subscribeStartTime": el.subscribeStartTime
					})
				})
				let parameterEnd = {
					"transitionList": parameter
				}
				api_home.fetchTechbicanChick(parameterEnd).then((res) => {
					if (res.code == 200) {
						uni.setStorageSync('transitionIds',res.data.transitionIds)
						const params = encodeURIComponent(JSON.stringify(this.dataList))
						const params2 = encodeURIComponent(JSON.stringify(this.transferData))
						uni.navigateTo({
							url: `/subPages/home/confirmOrder?chooseData=${params}&transferData=${params2}`,
						})
					} else {
						this.$emit('isTechnicianClick', res.msg)
					}
				})
			},
			toMasterDetail(item) {
				uni.navigateTo({
					url: `/subPages/technician/technicianDetail?id=${item.id}`,
				})
			},
			minusGoods(item, gItem, number) {
				const goodsNumStr = item.id + item.projectId + item.subscribeStartTime.slice(0, item.subscribeStartTime
					.length - 3)
				this.goodsNumData = {
					...this.goodsNumData,
					[goodsNumStr]: {
						...this.goodsNumData[goodsNumStr],
						[gItem.id]: number === 0 ? 0 : number - 1
					}
				}
				this.$emit('setNumConfig', this.goodsNumData)
				this.dataList = this.dataList.map(dItem => {
					const dTime = dItem.subscribeStartTime.slice(0, dItem.subscribeStartTime.length - 3)
					const iTime = item.subscribeStartTime.slice(0, item.subscribeStartTime.length - 3)
					if (dItem.id === item.id && dTime === iTime && dItem.projectId === item.projectId) {
						if (this.goodsNumData[goodsNumStr][gItem.id] >= 1) {
							dItem.zyOrderProductList.forEach(pItem => {
								if (pItem.id === gItem.id) {
									pItem.productNum = this.goodsNumData[goodsNumStr][gItem.id]
								}
							})
						} else {
							if (dItem.zyOrderProductList) {
								dItem.zyOrderProductList = dItem.zyOrderProductList.filter(zItem => zItem.id !==
									gItem.id)
							}
						}
					}
					return dItem
				})
				uni.setStorageSync('chooseTechnician', this.dataList)
				this.getAccount()
			},
			plusGoods(item, gItem, number) {
				if (number === 1) return
				const goodsNumStr = item.id + item.projectId + item.subscribeStartTime.slice(0, item.subscribeStartTime
					.length - 3)
				this.goodsNumData = {
					...this.goodsNumData,
					[goodsNumStr]: {
						...this.goodsNumData[goodsNumStr],
						[gItem.id]: number + 1
					}
				}
				this.$emit('setNumConfig', this.goodsNumData)
				this.dataList = this.dataList.map(dItem => {
					const dTime = dItem.subscribeStartTime.slice(0, dItem.subscribeStartTime.length - 3)
					const iTime = item.subscribeStartTime.slice(0, item.subscribeStartTime.length - 3)
					if (dItem.id === item.id && dTime === iTime && dItem.projectId === item.projectId) {
						if (this.goodsNumData[goodsNumStr][gItem.id] > 1) {
							dItem.zyOrderProductList.forEach(pItem => {
								if (pItem.id === gItem.id) {
									pItem.productNum = this.goodsNumData[goodsNumStr][gItem.id]
								}
							})
						} else {
							dItem.zyOrderProductList = dItem.zyOrderProductList ? [...dItem.zyOrderProductList] :
							[]
							dItem.zyOrderProductList.push({
								id: gItem.id,
								productNum: 1,
								productName: gItem.productName,
								originalPrice: gItem.originalPrice
							})
						}
					}
					return dItem
				})
				uni.setStorageSync('chooseTechnician', this.dataList)
				this.getAccount()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.continue {
		width: 144rpx;
		height: 59rpx;
		line-height: 59rpx;
		opacity: 1;
		border-radius: 47rpx;
		background: rgba(253, 240, 220, 1);
		text-align: center;
		font-size: 26rpx;
		font-weight: 400;
		color: rgba(194, 126, 21, 1);
		margin-right: 20rpx;
	}

	.fix-text {
		font-size: 26rpx;
		font-weight: 400;
		letter-spacing: 0rpx;
		line-height: 37.65rpx;
		color: rgba(102, 102, 102, 1);
	}

	.fix-money {
		font-size: 40.11rpx;
		font-weight: 700;
		color: rgba(254, 77, 79, 1);
		display: flex;
		margin-right: 10rpx;
	}

	::v-deep .action {
		.u-action-sheet__header__title {
			color: #fff;
		}
	}

	.action-list {
		width: 100%;
		max-height: 50vh;
		margin-bottom: calc(160rpx - env(safe-area-inset-bottom));
	}

	.submit {
		width: 164rpx;
		height: 76rpx;
		line-height: 76rpx;
		text-align: center;
		opacity: 1;
		border-radius: 40rpx;
		background: rgba(252, 81, 48, 1);
		font-size: 26rpx;
		color: rgba(255, 255, 255, 1);
	}
</style>